<template>
                <div>
                    <el-table
                        v-loading="loading"
                        :data="dataList"
                        ref="singleTable"
                        @row-click="handleSelectionChange"
                        highlight-current-row
                        :header-cell-style="{background:'#DADDE9',color:'#000',height:'34px'}"
                        class="table-box"
                        max-height="280"
                    >
                        <el-table-column
                        type="index"
                        align="center"
                        width="80"
                       >
                        </el-table-column>
                        <el-table-column label="名称" width="120" :show-overflow-tooltip="true" prop="name" align="center"/>  
                        <el-table-column label="创建人" width="100" :show-overflow-tooltip="true" prop="createBy" align="center"/>  
                        <el-table-column label="电缆布置类型" width="250" prop="cableAssignType" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="电极间距"  prop="electrodeSpace" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="设备序列号" width="200" prop="deviceNum" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="电极数" prop="electrodeNum" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="发射波形" prop="c" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="工业频率" prop="industryHz" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="迭代次数" prop="iterationNum" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="发射频率" prop="launchHz" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="通道数" prop="pipelineNum" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="测点数" prop="pointsNum" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="脚本名称" prop="scriptName" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="脚本类型" prop="scriptType" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="发射频率" prop="launchHz" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="温度" prop="temperature" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="测试方法" width="200" prop="testMethod" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="测试时间" width="200" prop="testTime" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="天气" prop="weather" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column label="风力" prop="windPower" :show-overflow-tooltip="true" align="center"/>
                        <el-table-column
                            label="操作"
                            align="center"
                            class-name="small-padding"
                            width="220"
                        >
                            <template slot-scope="scope">
                                <el-button
                                    size="medium"
                                    type="text"
                                    @click.stop="handleUpdate1(scope.row)"
                                >查看详情</el-button>
                            </template>
                        </el-table-column>  
                    </el-table>
                </div>
         
        <!-- </div> -->
</template>

<script>
import {delError} from "@/api/data/proData"
// import {flyToFeature} from '../showMap'
export default {
    name: "detailList",
    props: {
        //表格数据
        dataList: {
            type: Array
        },
        flyToFeature: {
            type: Function,
            default: null
        },
        //数据类别
        dataToSite:{}
    },
    data() {
        return {
            loading: false,
            // 查询条件
            // 是否显示弹出层
            open: false,
            
        };
    },
    created() {
    },
    computed: {
        popupData () {
            return this.$store.getters.popupData;　　//需要监听的地图点击数据
        }
        },
    watch:{
        popupData(val){
            if (val) {
                this.setCurrent(val)
            }
            else{
                this.setCurrent()
            }
        }
    },
    methods: {
        // 选中
        handleSelectionChange(val) {
            this.flyToFeature(val,'id','name')
        },  
        //被选中
        setCurrent(row){
            this.$refs.singleTable.setCurrentRow(row);
            let rowIndex = undefined;
            if(row.theGeom){
                    this.dataList.forEach((item,index )=> {
                    if(item.theGeom == row.theGeom){
                        rowIndex = index
                    }
                });
                if(rowIndex==undefined){
                    this.$notify({
                        title: '提示',
                        message: '非点击要素列表',
                        offset: 100
                        });
                } 
                else{
                    this.$refs.singleTable.bodyWrapper.scrollTop = (rowIndex-4)*50
                }
             
            }
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            let errorID = row.abnormalId;
            this.$confirm(`是否确认删除此条异常点数据项?`, "警告", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(function () {
                return delError(errorID);
            }).then(() => {
                this.$emit('listenDeleteChange', row);
                this.msgSuccess("删除成功");
            }).catch(() => { })
        },
        /** 查看详情 */
        handleUpdate1(row) {
            let dataType= this.dataToSite.dataType
            let data = {
                Id:row.id,
                dataType:dataType
            }
            this.$router.push({ name:'Table',query:data });
            this.$refs.singleTable.setCurrentRow(row);
        },
        dealThegeo(val){
            if(val){
                return val.replace("POINT","").replace("","").replace(" ",",")
            }
            else{
                return ""
            }
			},
    }
}
</script>
<style scoped>

.table-box{
    height: 280px;
}
.description {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    margin-block-end: 0px;
    margin-block-start: 0px;
}
.clearfix:before,
.clearfix:after {
    display: table;
    content: ""; /*不用有内容也可以*/
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}
.formbox{
    padding:20px 20px;
}
.el-table td,.el-table th{
     padding: 8px 0
 }
.deletBtn{
    color:red
}
.deletBtn:focus{
    color:#C90009  !important
}
.deletBtn:hover,.deletBtn:visited{
    color: #C90009;
}
.hiddenbox{
    z-index: -10;
}
</style>

